<!doctype html>
<html class="no-js">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>登录-{$siteInfo['title']}</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <link rel="stylesheet" href="/themes/amaze/assets/css/amazeui.min.css">
  </head>
  <body>  
    {include file="public/nav" /}    
    <form id="LoginForm" class="am-form" method="post">
      <fieldset>
        <legend>登录</legend>
        <div id="alert"></div>
        <div class="am-form-group">
          <label>用户名</label>
          <input type="text" name="user" class="" placeholder="手机号/邮箱/用户名">
        </div>
        <div class="am-form-group">
          <label>密码</label>
          <input type="password" name="pwd" class="" placeholder="输入密码">
        </div>
        <div class="am-form-group" id="code-div" style="display: none;">
          <label>验证码</label>
          <input type="text" name="code" style="width:50%;" placeholder="输入验证码">
          <img style="height:37px;width:40%;cursor: pointer;position: relative;left:55%;top:-35px;" id="code-img" style="margin-left:55px;margin-bottom:20px" src="{:captcha_src()}" id="yzm" onclick="this.src='{:captcha_src()}?x='+Math.random();" />
        </div>
        <p><button id="btn_Login" type="button" class="am-btn am-btn-secondary am-btn-block">登录</button></p>
        <p><a href="/home/index/register" class="am-btn am-btn-warning am-btn-block">去注册</a></p>
      </fieldset>
    </form>    
    {include file="public/footer" /}     
    <script src="/themes/amaze/assets/js/amazeui.min.js"></script>
    <script>
      //登录JS
      $("#btn_Login").click(function(){
        var data = $("#LoginForm").serialize();
        $.ajax({
          type:"post",
          url:'/home/index/login',
          data:data,
          dataType:'json',
          success:function(e){
            switch(e.code)
                {                  
              case 204:
                if(e.count > 5){
                  $("#code-div").show();
                }
                $("#alert").html('<div class="am-alert am-alert-danger" data-am-alert>'+e.msg+'</div>');
                setTimeout(function(){
                  $("#alert").html("");
                },2000)
                document.getElementById('code-img').src='{:captcha_src()}?x='+Math.random()
                break;
              case 200:
                $("#alert").html('<div class="am-alert am-alert-success" data-am-alert>'+e.msg+'</div>');
                setTimeout(function(){
                  location.href='/home/ucenter';
                },2000)               
                break;
            }
          },
        })
      })
    </script>
  </body>
</html>
